<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form id="formStr" action="" class="layui-form">
    <div class="layui-form-item">
        <label class="layui-form-label">角色名称</label>
        <div class="layui-input-block">
            <input type="text" name="rname" lay-verify="title" autocomplete="off" placeholder="请输入角色名称"
                   class="layui-input" style=" width: 312px;">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">编码</label>
        <div class="layui-input-block">
            <input type="text" name="coding" lay-verify="title" autocomplete="off" placeholder="请输入编码"
                   class="layui-input" style="     width: 312px;">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">角色类型</label>
        <div class="layui-input-block">
            <input type="text" name="type" lay-verify="title" autocomplete="off" placeholder="请输入角色类型"
                   class="layui-input" style="     width: 312px;">
        </div>
    </div>
</form>
<button class="layui-btn" onclick="addShop()">确认添加</button>

</body>

<!-- 引入 layui.css -->
<link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">

<!-- 引入 layui.js -->
<script src="//unpkg.com/layui@2.6.8/dist/layui.js"></script>
<script type="text/javascript" src="/js/js/jquery-3.1.1.min.js"></script>
<script>
    function addShop() {
        /*获取到表单的所有信息*/
        var formStr = $("#formStr").serialize();
        console.log(formStr)
        $.post("/role/addRole?"+formStr,function (res) {
            if(res=="ok"){
                alert("添加成功！")
                location.href="/gorole"
            }else{
                alert("添加失败！")
                location.reload();
            }
        },"text");
    }

</script>
</html>